<template>
	<view class="">
	
		<view class="body" >
			<view class="top-container">
				<uni-list :border="false" >
					<!-- <uni-list-item :border="false" title="执行者" :rightText="userInfo.name" /> -->
					<uni-list-item :border="false" title="单据编号"  :rightText="header.billNo" />
					<uni-list-item :border="false" title="物料名称"  :rightText="header.materialName" />
					<uni-list-item :border="false" title="数量"  	:rightText="String(header.qty)" />
					<!-- <uni-list-item :border="false" title="BOM版本"  :rightText="detail[0].fbomname" /> -->
					<uni-list-item :border="false" title="日期">
						<template v-slot:footer>
							<uni-dateformat  :date="header.date" format="yyyy年MM月dd日">
							</uni-dateformat>
						</template>
					</uni-list-item>	
				</uni-list>
			</view>
			
			<template v-if="moldList && moldList.length > 0" >
		
				<uni-swipe-action-item class="" v-for="(item,index) in moldList"  :key = "index">
					<view class="panel">
						<view class="panel_content">
							<view class="panel_content_row">
								<view class="panel_content_row_item">
									<view class="panel_content_row_item_title">编码：</view>
									<view class="panel_content_row_item_value">{{ item.materialNo }}</view>
								</view>
								<view class="panel_content_row_item">
									<view class="panel_content_row_item_title">件号：</view>
									<view class="panel_content_row_item_value">{{ item.specification }}</view>
								</view>
							</view>
						</view>
						<view class="panel_content">
							<view class="panel_content_row">
								<view class="panel_content_row_item">
									<view class="panel_content_row_item_title">仓位：</view>
									<view class="panel_content_row_item_value">{{ item.locationNo }}</view>
								</view>
								<!-- 暂时没有材质，用单位代替 -->
								<view class="panel_content_row_item">
									<view class="panel_content_row_item_title">使用次数：</view>
									<view class="panel_content_row_item_value">{{ item.useCount }}</view>
								</view>
							</view>
						</view>
	
						<view class="select-button-container">
							<button class="select-button" @click="pickScan(item)">归还</button>
						</view>
					</view>
				</uni-swipe-action-item>	
			
			</template>
		<uni-empty-info v-else label="暂无模具信息"></uni-empty-info>
			
		</view>	
		<!--  底部按钮  -->
		<view class="footerPanel">
			<view class="footerPanel_body">
				<!-- <button @click="pickScan" class="footerBtn scan" type="primary"><i
						class="iconfont icon-saomiao btn_icon"></i>扫码
				</button> -->
		
				
			</view>
		</view>
		<!-- 获取托盘信息 -->
		<GetMold ref="moldRef" @success="getMoldSuccess"></GetMold>
		
		<!-- 扫描托盘 -->
		<tray-popup ref="trayPopupRef" @success="trayScanningScuess"></tray-popup>
</view>
</template>

<script>
	import uniTransition from 'uni_modules/uni-transition/components/uni-transition/uni-transition.vue';
	import uniEmptyInfo from "../../vBase/components/uni-empty-info/uni-empty-info.vue"
	import {getProPlanDetailMoldReturn,
	returnMoldByorderNo,
	getMold
	} from '@/utils/api.js'
	import GetMold from "../pop/get_mold.vue"
	import trayPopup from '../../components/popup/trayPopup.vue'

	export default {
		components: {
			GetMold,
			uniEmptyInfo,
			trayPopup
		},
		data(){
			return{
				billNo: '',
				loading: true,
				header:{},
				detail:[],
				moldList:[],
				moldData:{},
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#FF4E74'
					}
				}],
			}
	},
	methods:{
		//添加成功后返回
		getMoldSuccess(e){
			this.initData()
		},
	
		//扫码成功后返回
		trayScanningScuess(e){
			
			//做一个空值判断
			if (e === '' || e === null){
				e = this.moldData.locationNo
				// uni.showToast({
				// 	title:'扫描内容为空',
				// 	icon:'none'
				// })
				// return;
			}
			let _this = this;
			//判断一下扫描的仓位和领用的仓位是否是一个
			if(this.moldData.locationNo === e){
				uni.showModal({
					title:'仓位:' + e ,
					content:'是否确认归还模具',
					success(res) {
						if (res.confirm){
							returnMoldByorderNo({locationNo : e,billNo :_this.header.billNo,moldData : _this.moldData }).then(result => {
							if (result.data.data){
								uni.showToast({
									title:'模具归还成功',
									icon:'none'
								})
							}
							_this.initData()
							
							})
						
						}
					}
				})
				
			} else {
				uni.showModal({
					title:'仓位:' + e + ",和领用仓位不一致是否确认归还到此仓位",
					content:'是否确认归还模具',
					success(res) {
						if (res.confirm){
							returnMoldByorderNo({locationNo : e,billNo :_this.header.billNo,moldData : _this.moldData }).then(result => {
							if (result.data.data){
								uni.showToast({
									title:'模具归还成功',
									icon:'none'
								})
							}
							_this.initData()
							
							})
						
						}
					}
				})
			}


		},
		//扫码获取领料信息
		pickScan(item){
			//赋值当前扫码的托盘信息
			this.moldData = item
			this.$refs.trayPopupRef.open()
		},
		// 获取详情数据
		initData(){
			getProPlanDetailMoldReturn({billNo :this.billNo }).then(res => {
				if (res.statusCode == 200){
					this.header = res.data.data.data
			
					this.moldList = res.data.data.moldList
				} 
			})

		}
	},
	watch: {
		userInfo() {
			
			}
		},
		mounted() {
			this.initData()

		},
	onLoad(e){
		this.billNo = e.billNo
		
	}
}
</script>

<style lang="scss" scoped>
	@import "../../static/css/common";
	
.select-button-container {
		position: absolute;
		top: 10px;
		right: 10px;
	}

	.select-button {
		font-size: 12px;
		padding: 2px 8px;
		height: 24px;
		line-height: 20px;
		border-radius: 4px;
		background-color: #007aff;
		color: #fff;
		border: none;
		min-width: 48px;
	}
</style>